<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width"/>
    <link rel="shortcut icon" th:href="@{/image/favicon.ico}" type="image/x-icon"/>

    <title>日记</title>
    <link th:href="@{/font-awesome/css/font-awesome.min.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/layui/css/layui.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/master.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/timeline.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/gloable.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/nprogress.css}" rel="stylesheet" type="text/css">
</head>
<body>
<div class="header">
</div>
<div th:replace="comm/Wl2022-Comm :: #commHeader"></div>

<div class="doc-container" id="doc-container">
    <div class="container-fixed">
        <div class="timeline-box shadow">
            <div class="timeline-main">
                <h1><i class="fa fa-clock-o"></i>网站历程</h1>
                <div class="timeline-line"></div>

                <!--按照年封装信息，循环-->
                <div class="timeline-year" th:each="diarys,s:${diaryList}" th:if="${diarys}!=null">
                    <h2 th:if="${s.index}==0"><a class="yearToggle" >[[${#dates.year(diarys[0].dateTime)}]]</a><i class="fa fa-caret-down fa-fw"></i></h2>
                    <div class="timeline-month">
                        <ul>
                            <li th:each="diary:${diarys}">
                                <div class="h4 animated fadeInLeft">
                                    <p class="date">
                                        [[${#dates.month(diary.dateTime)} + '月' + ${#dates.day(diary.dateTime)} + '日']]
                                    </p>
                                </div>
                                <p class="dot-circle animated "><i class="fa fa-dot-circle-o"></i></p>
                                <div class="content animated fadeInRight">[[${diary.content}]]</div>
                                <div class="clear"></div>
                            </li>
                        </ul>
                    </div>
                </div>
                <h1 style="padding-top:4px;padding-bottom:2px;margin-top:40px;"><i class="fa fa-hourglass-end"></i>THE
                    END</h1>
            </div>
        </div>
    </div>
</div>

<div th:replace="comm/Wl2022-Comm::#commFooter"></div>


<script th:src="@{/layui/layui.js}"></script>
<script th:src="@{/js/yss/gloable.js}"></script>

<script th:src="@{/js/plugins/nprogress.js}"></script>
<script>NProgress.start();</script>
<script th:src="@{/js/pagediary.js}"></script>


<script>
    window.onload = function () {
        NProgress.done();
    };
</script>
</body>
</html>
